<header class="hero-unit" id="banner">
  <div class="container">
    <h1>'Allo, 'Allo!</h1>
    <p class="lead">Kick-start your next web app with Angular Fullstack</p>
    <img src="assets/images/yeoman.png" alt="I'm Yeoman">
  </div>
</header>

<div class="container">
  <div class="row">
    <div class="col-lg-12">
      <h1 class="page-header">Features:</h1>
      <ul class="nav nav-tabs nav-stacked col-md-4 col-lg-4 col-sm-6" *ngFor="let thing of awesomeThings">
        <li><a <% if(filters.uibootstrap) { %> [tooltip]="thing.info"<% } %>>
          {{thing.name}}<% if(filters.models) { %>
          <button type="button" class="close" (click)="deleteThing(thing)">&times;</button><% } %>
        </a></li>
      </ul>
    </div>
  </div><% if (filters.ws) { %>

  <form class="thing-form">
    <label>Syncs in realtime across clients</label>
    <p class="input-group">
      <input type="text" class="form-control" placeholder="Add a new thing here." [(ngModel)]="newThing" name="thing">
      <span class="input-group-btn">
        <button type="submit" class="btn btn-primary" (click)="addThing()">Add New</button>
      </span>
    </p>
  </form><% } %>
</div>
